<!-- D:/project/app/ydz-app-uniapp/static/images/mine -->
<template>
	<view class="pagebody">
		<view class="topbox">
			<view class=" align-center">
				<view class=" flex-row align-center">
					<image @click="backpage" src="@/static/images/login/leftjt.png" alt=""
						style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="color303b39 fz40 fwbold" style="margin-left: 263rpx;">
					消息中心
				</view>
			</view>
		</view>
		<view class="" style="padding: 0 23rpx;">
			<view v-for="(item,index) in meslist" :key="index" class=" bgfff mb20 br30" style="padding: 32rpx 24rpx;"
				@click="todetail(item)">
				<view class="justify-between pos-rel align-center"
					style="line-height: 50rpx;padding: 0 0 20rpx 15rpx;border-bottom: 1rpx solid #D7DDDC;">
					<view :class="item.remindTitle?'orangetype':item.noticeType=='0'?'bluetype':'greentype'"
						class="pos-abs  align-center justify-center fwbold"
						style="top: 0; left: 0;width: 104rpx;height: 48rpx;border-radius: 44rpx;">
						{{item.remindTitle?'用药':item.noticeType=='0'?'系统':'疾病'}}
					</view>
					<view class=" lineclamp2 color303b39 fz36 fwbold" style="width: 596rpx;text-indent: 99rpx;">
						{{item.remindTitle?item.remindTitle:item.title}}
					</view>
					<!-- 					<view class="" style="width: 12rpx; height:12rpx;background: #FC4112;border-radius: 50%;">
					</view> -->
				</view>
				<view class=" flex-row align-center mt35 justify-between" style="color: #7E8987;">
					<view class="fz24">
						{{item.createTime}}
					</view>
					<view class="fz28 flex-row align-center">
						查看详情<image src="../../static/images/mine/mesright.png" style="width: 28rpx;height: 28rpx;"
							mode=""></image>
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	import {
		getNotes
	} from '@/api/api.js'
	export default {
		components: {

		},
		onLoad(options) {

		},


		data() {
			return {
				meslist: []

			}
		},
		watch: {},
		created() {
			getNotes().then(res => {
				const mergedArray = [...res.data.diseaseNotices, ...res.data.medicationReminders, ...res.data
					.systemNotices
				].sort((a, b) => {
					return new Date(b.createTime) - new Date(a.createTime); // 降序
				});
				this.meslist = mergedArray

			})
		},

		methods: {
			backpage() {
				uni.navigateBack({
					delta: 1,
				});
			},
			todetail(item) {
				let type = 0
				let id = item.id
				// item.remindTitle?'用药':item.noticeType=='0'?'系统':'疾病'
				if(item.remindTitle){
					type = '用药'
				}else if(item.noticeType=='0'){
					type = '系统'
				}else{
					type = '疾病'
				}
				uni.navigateTo({
					url: '/pages/mine/msgdetail?id='+id+'&type='+type
				})
			}


		},

	}
</script>

<style lang="scss" scoped>
	.pagebody {
		padding-bottom: 136rpx;
		background: #F0F6F5;

		.topbox {
			height: 128rpx;
			background: linear-gradient(180deg, rgba(0, 217, 178, 0.2) 0%, rgba(0, 217, 178, 0) 100%);
			padding: 20rpx 24rpx;
		}

		.orangetype {
			background: #FDF4EA;
			color: #FF8800;
		}

		.bluetype {
			background: #EBF3FF;
			color: #1080F7;
		}

		.greentype {
			background: #E9FCF8;
			color: #00977C;
		}



	}
</style>